<template>
  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 78 78">
    <g fill-rule="evenodd" clip-rule="evenodd">
      <path fill="url(#a)"
            d="M39 76c20.434 0 37-16.566 37-37S59.434 2 39 2 2 18.566 2 39s16.566 37 37 37Zm0-5c17.673 0 32-14.327 32-32C71 21.327 56.673 7 39 7 21.327 7 7 21.327 7 39c0 17.673 14.327 32 32 32Z"/>
      <path fill="url(#b)"
            d="M39 76c20.434 0 37-16.566 37-37S59.434 2 39 2 2 18.566 2 39s16.566 37 37 37Zm0-5c17.673 0 32-14.327 32-32C71 21.327 56.673 7 39 7 21.327 7 7 21.327 7 39c0 17.673 14.327 32 32 32Z"/>
    </g>
    <circle cx="39" cy="39" r="30" fill="url(#c)"/>
    <circle cx="39" cy="39" r="30" fill="url(#d)" fill-opacity=".7" style="mix-blend-mode:screen"/>
    <g filter="url(#e)">
      <circle cx="39" cy="39" r="29.5" stroke="#000"/>
    </g>
    <g filter="url(#f)">
      <path fill="#000" fill-opacity=".3"
            d="m55.681 53.597-8.973-18.865c-.54-1.147-1.316-1.924-2.429-2.463l-18.824-8.91c-2.429-1.147-4.25.607-3.103 3.105 1.147 2.497 8.94 18.831 8.94 18.831.505 1.08 1.248 1.822 2.428 2.43l18.858 8.943c2.361 1.114 4.183-.742 3.103-3.071Zm-12.38-13.6c0 2.328-1.923 4.252-4.25 4.252-2.328 0-4.251-1.924-4.251-4.252a4.255 4.255 0 0 1 4.25-4.252c2.328 0 4.25 1.89 4.25 4.252Z"/>
    </g>
    <path fill="#000" fill-opacity=".8"
          d="m55.681 52.597-8.973-18.865c-.54-1.147-1.316-1.924-2.429-2.463l-18.824-8.91c-2.429-1.147-4.25.607-3.103 3.105 1.147 2.497 8.94 18.831 8.94 18.831.505 1.08 1.248 1.822 2.428 2.43l18.858 8.943c2.361 1.114 4.183-.742 3.103-3.071Zm-12.38-13.6c0 2.328-1.923 4.252-4.25 4.252-2.328 0-4.251-1.924-4.251-4.252a4.255 4.255 0 0 1 4.25-4.252c2.328 0 4.25 1.89 4.25 4.252Z"/>
    <path fill="url(#g)"
          d="m55.681 52.597-8.973-18.865c-.54-1.147-1.316-1.924-2.429-2.463l-18.824-8.91c-2.429-1.147-4.25.607-3.103 3.105 1.147 2.497 8.94 18.831 8.94 18.831.505 1.08 1.248 1.822 2.428 2.43l18.858 8.943c2.361 1.114 4.183-.742 3.103-3.071Zm-12.38-13.6c0 2.328-1.923 4.252-4.25 4.252-2.328 0-4.251-1.924-4.251-4.252a4.255 4.255 0 0 1 4.25-4.252c2.328 0 4.25 1.89 4.25 4.252Z"
          opacity=".14"/>
    <path fill="url(#h)" fill-opacity=".08"
          d="M61.248 56.008c.166-.217.25-.325.378-.66.754-1.95-1.183-3.95-3.157-3.26-.338.118-.904.522-2.035 1.332A29.863 29.863 0 0 1 39 59.003a29.863 29.863 0 0 1-17.425-5.577c-1.132-.809-1.697-1.213-2.035-1.331-1.974-.69-3.911 1.313-3.156 3.263.129.334.212.442.378.659 5.118 6.679 13.176 10.986 22.24 10.986 9.068 0 17.129-4.31 22.246-10.995Z"/>
    <path fill="url(#i)" fill-opacity=".2"
          d="M62.26 40.051C63.805 41.947 67 41.445 67 39c0-15.464-12.536-28-28-28S11 23.536 11 39c0 2.445 3.195 2.946 4.74 1.051C21.241 33.307 29.618 29 39 29c9.382 0 17.758 4.307 23.26 11.051Z"/>
    <path fill="url(#j)" d="M39 45a6 6 0 1 1 0-11.999 6 6 0 0 1 0 12Z"/>
    <path stroke="#fff" stroke-opacity=".24" stroke-width=".125"
          d="M36.728 44.486a5.938 5.938 0 1 0 4.545-10.971 5.938 5.938 0 0 0-4.545 10.971Z"/>
    <g filter="url(#k)">
      <path fill="#1A1B1F" d="M39 46a6 6 0 1 1 0-11.999 6 6 0 0 1 0 12Z"/>
    </g>
    <path fill="url(#l)" d="M39 44.5a5.5 5.5 0 1 1 0-11 5.5 5.5 0 0 1 0 11Z"/>
    <path stroke="#fff" stroke-opacity=".24" stroke-width=".25"
          d="M36.944 43.966a5.376 5.376 0 1 0 4.114-9.934 5.376 5.376 0 0 0-4.114 9.934Z"/>
    <path fill="url(#m)" fill-rule="evenodd"
          d="M36.704 44.544a6.002 6.002 0 0 0 8.297-5.543 6 6 0 1 0-8.297 5.543Zm.191-.463a5.5 5.5 0 1 0 4.21-10.163 5.5 5.5 0 0 0-4.21 10.163Z"
          clip-rule="evenodd"/>
    <path fill="url(#n)" fill-opacity=".06"
          d="M36.897 42.12A5.98 5.98 0 0 0 39 42.5c1.46 0 2.858-.526 3.89-1.464.256-.233.701-.022.54.285a5 5 0 0 1-9.049-.406c-.098-.238.237-.383.411-.195a5.565 5.565 0 0 0 2.103 1.4Z"/>
    <g fill-rule="evenodd" clip-rule="evenodd">
      <path fill="url(#o)"
            d="M39 71c17.673 0 32-14.327 32-32C71 21.327 56.673 7 39 7 21.327 7 7 21.327 7 39c0 17.673 14.327 32 32 32Zm0-2c16.569 0 30-13.431 30-30C69 22.431 55.569 9 39 9 22.431 9 9 22.431 9 39c0 16.569 13.431 30 30 30Z"/>
      <path fill="url(#p)"
            d="M39 71c17.673 0 32-14.327 32-32C71 21.327 56.673 7 39 7 21.327 7 7 21.327 7 39c0 17.673 14.327 32 32 32Zm0-2c16.569 0 30-13.431 30-30C69 22.431 55.569 9 39 9 22.431 9 9 22.431 9 39c0 16.569 13.431 30 30 30Z"/>
    </g>
    <path fill="url(#q)" fill-rule="evenodd"
          d="M39 76c20.434 0 37-16.566 37-37S59.434 2 39 2 2 18.566 2 39s16.566 37 37 37Zm0-1c19.882 0 36-16.118 36-36S58.882 3 39 3 3 19.118 3 39s16.118 36 36 36Z"
          clip-rule="evenodd"/>
    <circle cx="39" cy="39" r="32" stroke="#fff" stroke-opacity=".3" stroke-width=".25"/>
    <defs>
      <linearGradient id="a" x1="39" x2="39" y1="2" y2="76" gradientUnits="userSpaceOnUse">
        <stop stop-color="#174299"/>
        <stop offset="1" stop-color="#001E59"/>
      </linearGradient>
      <linearGradient id="b" x1="39" x2="39" y1="2" y2="76" gradientUnits="userSpaceOnUse">
        <stop stop-color="#D2D8E4"/>
        <stop offset="1" stop-color="#C2C9D6"/>
      </linearGradient>
      <linearGradient id="g" x1="34" x2="46.5" y1="45.5" y2="33" gradientUnits="userSpaceOnUse">
        <stop stop-color="#fff" stop-opacity="0"/>
        <stop offset=".453" stop-color="#fff" stop-opacity=".64"/>
        <stop offset=".453" stop-color="#3B3B3B" stop-opacity=".233"/>
        <stop offset="1" stop-opacity="0"/>
      </linearGradient>
      <linearGradient id="i" x1="39" x2="39" y1="11" y2="41.205" gradientUnits="userSpaceOnUse">
        <stop stop-color="#fff"/>
        <stop offset="1" stop-color="#fff" stop-opacity="0"/>
      </linearGradient>
      <linearGradient id="j" x1="39.001" x2="38.751" y1="33" y2="45" gradientUnits="userSpaceOnUse">
        <stop stop-color="#DCE1EA"/>
        <stop offset="1" stop-color="#BEC6D5"/>
      </linearGradient>
      <linearGradient id="l" x1="39.001" x2="38.772" y1="33.5" y2="44.5" gradientUnits="userSpaceOnUse">
        <stop stop-color="#DCE1EA"/>
        <stop offset="1" stop-color="#BEC6D5"/>
      </linearGradient>
      <linearGradient id="m" x1="39" x2="39" y1="33" y2="45.001" gradientUnits="userSpaceOnUse">
        <stop stop-color="#F2F4F7"/>
        <stop offset="1" stop-color="#A3ADC2"/>
      </linearGradient>
      <linearGradient id="o" x1="39" x2="39" y1="7" y2="71" gradientUnits="userSpaceOnUse">
        <stop stop-color="#D2D8E4"/>
        <stop offset="1" stop-color="#C2C9D6"/>
      </linearGradient>
      <linearGradient id="p" x1="39" x2="39" y1="7" y2="71" gradientUnits="userSpaceOnUse">
        <stop stop-color="#9FACC6"/>
        <stop offset="1" stop-color="#E0E3EB"/>
      </linearGradient>
      <linearGradient id="q" x1="39" x2="39" y1="2" y2="76" gradientUnits="userSpaceOnUse">
        <stop stop-color="#F2F4F7"/>
        <stop offset="1" stop-color="#A3ADC2"/>
      </linearGradient>
      <radialGradient id="c" cx="0" cy="0" r="1" gradientTransform="rotate(-40.077 108.556 65.416) scale(118.435)"
                      gradientUnits="userSpaceOnUse">
        <stop offset=".276" stop-color="#20FF4D"/>
        <stop offset=".464" stop-color="#1499FF"/>
        <stop offset=".755" stop-color="#FF6FC6"/>
        <stop offset="1" stop-color="#BC67FF"/>
      </radialGradient>
      <radialGradient id="d" cx="0" cy="0" r="1" gradientTransform="rotate(45 .265 -.64) scale(98.1111)"
                      gradientUnits="userSpaceOnUse">
        <stop stop-color="red"/>
        <stop offset="1" stop-color="#00A3FF"/>
      </radialGradient>
      <radialGradient id="h" cx="0" cy="0" r="1" gradientTransform="matrix(0 -29.3887 57.4838 0 38.999 67)"
                      gradientUnits="userSpaceOnUse">
        <stop/>
        <stop offset="1" stop-opacity="0"/>
      </radialGradient>
      <radialGradient id="n" cx="0" cy="0" r="1"
                      gradientTransform="matrix(-.00135 -5.75038 8.42557 -.00199 39.002 44)"
                      gradientUnits="userSpaceOnUse">
        <stop/>
        <stop offset="1" stop-opacity="0"/>
      </radialGradient>
      <filter id="e" width="68" height="68" x="5" y="5" color-interpolation-filters="sRGB"
              filterUnits="userSpaceOnUse">
        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
        <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
        <feGaussianBlur result="effect1_foregroundBlur_2138_47895" stdDeviation="2"/>
      </filter>
      <filter id="f" width="38" height="38" x="20" y="21" color-interpolation-filters="sRGB"
              filterUnits="userSpaceOnUse">
        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
        <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
        <feGaussianBlur result="effect1_foregroundBlur_2138_47895" stdDeviation="1"/>
      </filter>
      <filter id="k" width="16" height="16" x="31.001" y="32" color-interpolation-filters="sRGB"
              filterUnits="userSpaceOnUse">
        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
        <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
        <feGaussianBlur result="effect1_foregroundBlur_2138_47895" stdDeviation="1"/>
      </filter>
    </defs>
  </svg>
</template>
<script setup lang="ts">
withDefaults(defineProps<{ width?: number; height?: number }>(), {
  width: 78,
  height: 78
})
</script>
